/*
* 模块描述：栅格系统应用
* 模块兼容：Chrome（latest-1）、Firefox（latest-1）、Explorer（9+）
* 模块作者：@iyoole
* 更新时间：2017-01-23
* 其他说明：栅格暂停止使用
*/

// 容器宽度
.container {
    .container-fixed();

    @media (min-width: @screen-sm-min) {
        width: @container-sm;
    }
    @media (min-width: @screen-md-min) {
        width: @container-md;
    }
    @media (min-width: @screen-lg-min) {
        width: @container-lg;
    }

}

.container-fluid {
    .container-fixed();
}

// 行
.row {
    .make-row();
}

// 列
.make-grid-columns();

// 移动设备优先
.make-grid(xs);

@media (min-width: @screen-sm-min) {
    .make-grid(sm);
}

@media (min-width: @screen-md-min) {
    .make-grid(md);
}

@media (min-width: @screen-lg-min) {
    .make-grid(lg);
}

// 使用示例
// -----------------------------------
//<div class="container">
//  <div class="row">
//    <div class="col-xs-4"></div>
//  </div>
//</div>
//<div class="container-fluid">
//  <div class="row">
//    <div class="col-xs-4"></div>
//  </div>
//</div>

// 参考文献
// -----------------------------------
// http://v3.bootcss.com/css/#grid
// http://caniuse.com/#feat=css-media-resolution

// https://github.com/twbs/bootstrap/blob/master/less/variables.less#L281
// https://github.com/twbs/bootstrap/blob/master/less/mixins/grid-framework.less
// https://github.com/twbs/bootstrap/blob/master/less/mixins/grid.less
// https://github.com/twbs/bootstrap/blob/master/less/grid.less
